<template>
  <ul class='list'>
    <li v-for="(item,index) in getListData">
      <p><span>消费项目：</span><span>{{item.name}}</span></p>
      <p><span>消费金额：</span><span>{{item.money}}</span></p>
      <p><span>消费方式：</span><span>{{item.way}}</span></p>
      <p><span>消费时间：</span><span>{{item.time}}</span></p>
    </li>
  </ul>
</template>
<script>
export default {
  props:["listData"],
  components: {},
  name: "",
  data() {
    return {};
  },
  computed:{

    getListData(){

      return this.listData||[]
    }
  },
  methods: {},
  created() {}
};
</script>
<style lang="scss" scoped>
.list {
  margin: 0 15px;
  font-size: 14px;
  color: #333;

  li{
    padding: 15px 0px;
    border-bottom: 1px solid #f2f2f2;
  }

  p{
    line-height: 22px;

    span:nth-child(2){
      color: #999;

    }
  }
}
</style>